<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	<title>一尺三寸</title>
	[#include "/theme/adminlte/common/sites.html" /]
	[@header /]

	<style type="text/css">
		footer {
			padding: 30px 0;
		}
		.md10{
			margin-bottom:20px;
		}
		.pannel{
			padding: 10px;
			border-radius: 6px;
		}
	</style>
	[@style "question.css" /]

</head>
<!-- ADD THE CLASS layout-top-nav TO REMOVE THE SIDEBAR. -->
<body class="hold-transition skin-blue layout-top-nav">
<div class="wrapper">

	<header class="main-header">
		[@nav  3 /]
	</header>
	<!-- Full Width Column -->
	<div class="content-wrapper">
		<div class="container" style="background-color: white;">
			<!-- Main content -->
			<section class="content">
				<div class="row">

					<div class="col-xs-12 col-sm-9">

						<h1>${question.title!""}</h1>
						<div>
							${question.contents!""}
						</div>

						<div class="comments" >
							<div class="comments-header">
								[@shiro.authenticated]
								<form action="${siteurl}user/updateuser.htm" method="post">

									<div class="form-group">
										<label>个性签名</label>
										<textarea required="required" maxlength="2000"  class="form-control"
												  id="contents" name="introduction" rows="3">${user.introduction!''}</textarea>








									</div>
									<button  id="button" type="button"
											 class="btn btn-default">
										提交
									</button>
								</form>
								[/@shiro.authenticated]
							</div>

						</div>

						<div id="questions" class="comments-list">
							<div style="display: none;"
								 class="empty-cmts alert alert-success">
								没有更多评论了^^
							</div>
						</div>
						<!--comment end -->

					</div>
					<!--/.col-xs-12.col-sm-9-->

					<div class="col-xs-6 col-sm-3" id="sidebar">
						<div class="list-group">
							[#if catalogs?? && question.catalog??]
							[#list catalogs as item  ]
							[#if item.id =question.catalog.id]
							<a href="${siteurl}question/catalog.htm?id=${item.id}" class="list-group-item active">${item.name!""} (${item.nums!"0"})</a>
							[#else]
							<a href="${siteurl}question/catalog.htm?id=${item.id}" class="list-group-item ">${item.name!""} (${item.nums!"0"})</a>
							[/#if]

							[/#list]
							[/#if]
						</div>
					</div>
					<!--/.sidebar-offcanvas-->
				</div>
			</section>
			<!-- /.content -->
		</div>
		<!-- /.container -->
	</div>
	<!-- /.content-wrapper -->

</div>
<!-- ./wrapper -->

[@scripts /]

[@js "jsrender.min.js" /]

<script id="theTmpl" type="text/x-jsrender">
			<div class="row">
			<div class="col-sm-1">
				<div id="voting_2" class="qa-voting qa-voting-net">
											<div class="qa-vote-buttons qa-vote-buttons-net">
												<input type="submit" disabled="disabled" class="qa-vote-first-button qa-vote-up-disabled" value="" title="你无法给自己的问题投票！">
												<input type="submit" disabled="disabled" class="qa-vote-second-button qa-vote-down-disabled" value="" title="你无法给自己的问题投票！">
											</div>
											<div title="" class="qa-vote-count qa-vote-count-net">
												<span class="qa-netvote-count">
													<span class="qa-netvote-count-data">
														{{if ups<999}}{{:ups}}{{else}}999{{/if}}
														<span class="votes-up">
															<span title="0" class="value-title">

															</span>
															</span>
															<span class="votes-down">
																<span title="0" class="value-title">

																</span>
																</span>
																</span>
																<span class="qa-netvote-count-pad"> 投票</span>
												</span>
											</div>
											<div class="qa-vote-clear">
											</div>
				</div>
			</div>
			<div class="col-sm-11">
				<div class="row">
				    <div class="col-sm-12">
					{{:contents}}
					</div>
				</div>
                <div class="row user">
				    <div class="col-sm-12">
					<span title="2016-03-22T13:11:29+0000" class="value-title">3月 22</span>
					<span>	用户: admin (260 分) </span>
					</div>
				</div>
                  <div class="row others">
				    <div class="col-sm-12">
					<a class="item">举报</a><a  class="item">提出相关问题</a>
					</div>
				</div>
			</div>
			</div>
			<hr/>
		</script>
<!--/.container-->

<script>
    var pageno=2;
    $(document).ready(function() {
        $.get("${siteurl}answer/page.htm?questionid=${question.id}", function(data) {
            if (data.code == 0) {
                var template = $.templates("#theTmpl");
                var htmlOutput = template.render(data.list);
                $("#questions").append(htmlOutput);
            };
        });

        $("#button").click(function() {
            var data = {};
            data.comment = $("#contents").val();
            if(data.comment==""){
                return;
            }



            data.qid = ${question.id};
            $.post("${siteurl}answer/answer.htm", data, function(item) {
                //alert(item)
                if (item.id > 0) {
                    var template = $.templates("#theTmpl");
                    var htmlOutput = template.render(item);
                    $("#questions").prepend(htmlOutput);
                    $("#contents").val("");
                } else {
                    console.log("评论失败");
                }

            });
        });

        $(window).scroll(function(){
            var scrollTop=$(this).scrollTop();//滚动条已经滚动的距离（高度）
            var windowHeight=$(this).height();//window窗口的高度
            var documentHeight=$(document).height();//文档对象的高度
            if((scrollTop+windowHeight)>=documentHeight-120){
                $.get("${siteurl}answer/page.htm?questionid=${question.id}&pageno="+pageno, function(data) {
                    if (data.code == 0&& data.totalPage<=pageno) {
                        var template = $.templates("#theTmpl");
                        var htmlOutput = template.render(data.list);
                        $("#questions").append(htmlOutput);
                    };
                });
                pageno++;

                //此处调用加载数据的函数
            }
        });

    });
</script>
</body>
</html>
